<template>
  <up-tabbar
    :placeholder="false"
    :value="tabbarValue"
    @change="name => (tabbarValue = name)"
    fixed
    :safe-area-inset-bottom="false"
  >
    <up-tabbar-item
      v-for="item of tabbarList"
      :icon="item.icon"
      :name="item.name"
      :text="item.text"
      :key="item.name"
      @tap="skipPage(item)"
    ></up-tabbar-item>
  </up-tabbar>
</template>
<script setup lang="ts">
let tabbarValue = useGlobalStore().tabbarValue;

let tabbarList = [
  {
    text: "首页",
    icon: "home",
    name: "home",
    url: "/pages/home/index"
  },
  {
    text: "计算",
    icon: "photo",
    name: "photo",
    url: "/pages/stock/calculate/index"
  },
  {
    text: "登记",
    icon: "play-right",
    name: "play-right",
    url: "/pages/stock/register/index"
  },
  {
    text: "查询",
    name: "account",
    icon: "account",
    url: "/pages/stock/history/index"
  }
];

const skipPage = item => {
  uni.reLaunch({
    url: item.url
  });
  useGlobalStore().setGlobalState("tabbarValue", item.name);
};
</script>
